Vue.component('header-component', {
    // 声明 props
    props: ['field', 'value'],
    template:   '<li class="nav-header">'+   	
				'	<div class="dropdown profile-element">'+ 
				'        <a class ="header-img">'+                  	
				'		     <img alt="image" class="img-circle" src="public/images/favicon.ico" />'+
				'		 </a>'+
				'	</div>'+
				'	<div class="logo-element">曦+</div>'+						  
				'</li>',		      
});

var menuItem = Vue.extend({
    name: 'menu-item',
    props: {item: {}},
    template:   [
					'<li v-if="item.type === 0">'+		
					'		<a href="#" class="waves-effect"><i v-if="item.icon != null" :class="item.icon"></i><span class="nav-label">{{menuData[item.name]}}</span><span class="fa arrow"></a>'+
					'  	    <ul v-if="item.level == 2" class="nav nav-second-level collapse">'+
					'			       <menu-item :item="item" v-for="item in item.list"></menu-item>'+
					'	    </ul>'+	
					'	    <ul v-else class="nav nav-third-level collapse">'+	
					'		       <menu-item :item="item" v-for="item in item.list"></menu-item>'+	
					'		</ul>'+
					'</li>'+
					'<li v-else>'+
					'		    <a class="menuItem waves-effect" :href="item.url" data-index="1">'+
					'				<i v-if="item.icon != null" :class="item.icon"></i> {{menuData[item.name]}}'+
					'			</a>'+
					'</li>'
				].join('')
});

$(document).ready(function () {
    //注册菜单组件
    Vue.component('menuItem', menuItem);
});